<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>桃子味的狐</title>

</head>

<body>

    <h1>一.选择器命名规则</h1>
    1.采用【大小写字母，数字，连字号"-"，下划线"_"】<br>
    2.不以数字开头<br>
    3.id和class名不重复<br>
    4.命名一般为小写英文<br>
    5.两个单词用"-"分割,例 "我的头部" 写成 "我的-头部"<br>
    6.子元素用"__"分割,例 "我的头部导航栏" 写成 "我的-头部__导航栏"
    <h1>二.css书写规则</h1>
    <pre>
        1.能用简写尽量简写
        2.去掉小数点的"0",例"0.5"写成".5"
        3.不要随意使用id
    </pre>
    <h1>三.css书写顺序</h2>
        <pre>
        1.位置(position, top, right, z-index, display, float等)　
        2.大小(width, height, padding, margin)
        3.文字(font, line-height, letter-spacing, color- text-align等)　
        4.背景(background, border等)
        5.其他(animation, transition等)
    </pre>
        <h1>css命名常用单词</h1>
        <pre>
        头: header
        内容:content/container
        尾:footer
        导航:nav
        侧栏: sidebar
        栏目:column
        页面外围控制整体宽度:wrapper
        左右中: left right left
        登录条:loginbar
        标志: logo
        广告: banner
        页面主体: main
        热点:hot
        新闻:news
        下载:download
        子导航:submenu
        搜索:search
        友情链接:friendlink
        页脚:footer
        版权:copyright
        滚动:scroll
        标签;tags
        文章列表:list
        提示信息:msg
        栏目标题:title
        加入:joinus
        指南:guide
        服务:server 
        注册:register
        状态:status
        投票:vote
        合作伙伴:partner
        <h2>页面结构</h2>
        容器: container
        页头:header
        内容:content/container
        页面主体:main
        页尾:footer
        导航:nav
        侧栏:sidebar
        栏目:column
        页面外围控制整体佈局宽度:wrapper
        左右中:left right center
        <h2>导航</h2>
        导航:nav
        主导航:mainnav
        子导航:subnav
        顶导航:topnav
        边导航:sidebar
        左导航:leftsidebar
        右导航:rightsidebar
        菜单:menu
        子菜单:submenu
        标题: title
        摘要: summary
        <h2>功能</h2>
        标志:logo
        广告:banner
        登陆:login
        登录条:loginbar
        注册:register
        搜索:search
        功能区:shop
        标题:title
        加入:joinus
        状态:status
        按钮:btn
        滚动:scroll
        标籤页:tab
        文章列表:list
        提示信息:msg
        当前的: current
        小技巧:tips
        图标: icon
        注释:note
        指南:guild
        服务:service
        热点:hot
        新闻:news
        下载:download
        投票:vote
        合作伙伴:partner
        友情链接:link
        版权:copyright
        主要的 master.css
        模块 module.css
        基本共用 base.css
        布局、版面 layout.css
        主题 themes.css
        专栏 columns.css
        文字 font.css
        表单 forms.css
        补丁 mend.css
        打印 print.css
    </pre>
</body>

</html>